<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>template-freework</title>
</head>

<body>
    <div id="container"></div>
    <script src="/xuni/bundle.js"></script>
    <script type="text/template" id="templateCon1">
        <ul>
            {{#students}}
            <li>
                <div>{{name}}的基本信息</div>
                <div>
                    <p>姓名：{{name}}</p>
                    <p>性别：{{sex}}</p>
                    <p>年龄：{{age}}</p>
                    <p>
                        爱好：
                        <ol>
                            {{#hobbies}}
                            <li>{{.}}</li>
                            {{/hobbies}}
                        </ol>
                    </p>
                </div>
            </li>
            {{/students}}
        </ul>
    </script>

    <script type="text/template" id="templateCon2">
        <ul>
            {{#students}}
            <li>
                <div>{{name}}的基本信息</div>
                <div>
                    <p>姓名：{{name}}</p>
                    <p>性别：{{sex}}</p>
                    <p>年龄：{{age}}</p>
                    <p>
                        爱好：
                        <ol>
                            {{#hobbies}}
                            <li>{{.}}</li>
                            {{/hobbies}}
                        </ol>
                    </p>
                </div>
            </li>
            {{/students}}
        </ul>
    </script>

    <script>
        var obj = {
            students: [{
                name: "Tom",
                sex: "boy",
                age: 14,
                hobbies: ['唱歌', '跳舞']
            }, {
                name: "Jerry",
                sex: "boy",
                age: 12,
                hobbies: ['读书', '音乐', '打球']
            }, {
                name: "Lily",
                sex: "girl",
                age: 13,
                hobbies: ['游戏', '娱乐']
            }, ]
        };
        var templateStr = document.getElementById("templateCon1").innerHTML;
        var result = Bryan_Template.render(templateStr, obj);
        console.log(result);
        document.getElementById("container").innerHTML = Bryan_Template.render(templateStr, obj);
    </script>
</body>

</html>